<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>淘宝网登录页面</title>
    <link rel="stylesheet" href="css.css">
</head>

<body>
   <div class="all">
       <div class="logo">
            <div class="logo-1">
                <img src="/img/淘宝网.png" alt="" style="width: 140px;height: 57px;" />
            </div>
            <div class="logo-2">用户注册</div>
       </div>
       <form action="">
            <table cellspacing="0" cellpadding="0">
                <tr>
                    <td>手机号码</td>
                    <td colspan="2">
                        <select>
                            <option value="">&nbsp;&nbsp;  中国大陆&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;+86</option>
                            <option value="">&nbsp;&nbsp;  中国台湾&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;+886</option>
                            <option value="">&nbsp;&nbsp;  中国香港&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;+852</option>
                            <option value="">&nbsp;&nbsp;  马来西亚&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;+60</option>
                            <option value="">&nbsp;&nbsp;  新加坡&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;+65</option>
                            <option value="">&nbsp;&nbsp;  日本&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;+81</option>
                        </select><input type="text" name="" id="" class="t1" placeholder="&nbsp;&nbsp;请输入你的手机号码"/>
                    </td>
                </tr>
                <tr>
                    <td>验证码</td>
                    <td colspan="2">
                        <input type="text" name="" id="" class="t2" placeholder="&nbsp;&nbsp;请输入校验码"/><a href="javascript:;" class="getCode">获取验证码</a>
                    </td>
                </tr>
                <tr>
                    
                    <td colspan="2"><button>同意协议并注册</button></td>
                </tr>
                <tr>
                    <td></td>
                    <td colspan="2" style="text-align: left; padding: 0 3px 0 16px">
                        <p1>已阅读并同意以下协议<a href="">淘宝平台服务协议</a>、<a href="">隐私权政策</a>、<a href="">法律申明</a>、<a href="">支付宝及客户服务协议</a></p1>
                    </td>
                </tr>
                <tr>
                    <td colspan="3"><a style="border: 0;" href="">切换成企业账户注册</a></td>
                </tr>
            </table>
       </form>
       <div class="botton">
            <ul>
                <li><a href="">阿里巴巴集团</a></li><li><a href="">阿里巴巴国际站</a></li><li><a href="">阿里巴巴中国站</a></li><li><a href="">全球速卖通</a></li><li><a href="">淘宝网</a></li><li><a href="">天猫</a></li><li><a href="">聚划算</a></li><li><a href="">一淘</a></li><li><a href="">阿里妈妈</a></li><li><a href="">阿里云计算</a></li><li><a href="">云OS</a></li><li><a href="">万网</a></li><li><a href="" style="border-right: 0;">支付宝</a></li>
            </ul>
            <div class="botton-2">
                <p>关于淘宝&nbsp;合作伙伴&nbsp;营销中心&nbsp;联系客服&nbsp;开放平台&nbsp;诚征英才&nbsp;联系我们&nbsp;网站地图&nbsp;法律声明及隐私权政策&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<c>© 2021 Taobao.com 版权所有<br><br>
                网络文化经营许可证：</c>文网文[2010]040号<c> | 增值电信业务经营许可证：浙B2-20080224-1 | 信息网络传播视听节目许可证：1109364号</c></p>
            </div>
        </div>
    </div> 
    <script>
        var t1 = document.querySelector('.t1');
        var getCode = document.querySelector('.getCode');
        getCode.addEventListener('click',function () {
          var str = t1.value;
          if(str.length==0){
            getCode.disable;
          }else if(str.length!=11 || isRight(str)==false){
            alert('请输入正确的电话号码');
          }else{
            getCode.style.pointerEvents='none';
            var num = 59;
            var clock = setInterval(() => {
              if (num<0) {
                clearInterval(clock);
                getCode.innerHTML = '获取验证码';
                getCode.style.padding= '6.5px 10px 9px 10px';
                getCode.style.pointerEvents='auto';
              }
              else{
                if(num>9){
                  getCode.innerHTML = '重新发送'+num+'s';
                }else{
                  getCode.innerHTML = '重新发送0'+num+'s';
                }
                num--;
              }
            }, 1000);
          }
        })
        function isRight(str) {
          for (let i = 0; i < str.length; i++) {
            const element = str[i];
            if(!(element>='0' && element<='9')){
              return false;
            }
          }
          return true;
        }
      </script>

</body>
</html>